<template>
	<div class="c-c-panel">
		<div class="c-c-user-view">
			<div class="c-c-user">
				<CUserItem :data="data.user">
				</CUserItem>
			</div>
			<span class="c-c-time" v-text="data.createTimeFormat"></span>
		</div>
		
		<div class="c-c-content">
			<div class="c-c-info-view">
				<span class="c-c-key">开始日期：</span>
				<span class="c-c-value" v-text="data.sdate"></span>
			</div>
			<div class="c-c-info-view">
				<span class="c-c-key">结束日期：</span>
				<span class="c-c-value" v-text="data.edate"></span>
			</div>
			<div class="c-c-info-view">
				<span class="c-c-key">档期安排：</span>
				<span class="c-c-value" v-text="data.content"></span>
			</div>
		</div>
		
		
	</div>
</template>

<script>
	import CUserItem from '@/components/CUserItem.vue';

	export default {
		name: 'CScheduleItem',
		data() {
			return {}
		},
		components: {
			CUserItem
		},
		props: ['data']
	}
</script>

<style>
	.c-c-panel {
		background-color: #FFFFFF;
	}
	
	.c-c-user-view {
		display: flex;
		display: -webkit-flex;
		display: -moz-flex;
		margin-bottom: 10px;
		padding: 20px 20px 0px 20px;
	}

	.c-c-user {
		flex: 1;
		-webkit-flex: 1;
	}
	
	.c-c-content {
		padding: 0px 20px 20px 20px;
	}
	
	.c-c-info-view {
		display: flex;
		margin-top: 8px;
	}
	
	.c-c-key {
		font-size: 14px;
		color: #000000;
		opacity: 0.54;
	}
	
	.c-c-value {
		font-size: 14px;
		color: #000000;
		opacity: 0.87;
	}
</style>